<template>
  <div class="booksystem">
    <bookTop
      v-model="formData"
      @restart="restart"
      @searchBooks="searchBooks"
    ></bookTop>
    <pageContet
      :contentTableConfig="contentTableConfig"
      @editbuttonClick="editbuttonClick"
      @deletebuttonClick="deletebuttonClick"
    ></pageContet>
    <PageModal
      :modelConfig="modelConfig"
      ref="pageModalRef"
      :defaultInfo="defaultInfo"
    />
  </div>
</template>

<script setup>
import deleteBooks from "@/service/main/system/deleteBooks";
import { ElMessage, ElMessageBox } from "element-plus";
import { modelConfig } from "./config/module.config";
import PageModal from "@/components/page-model/";
import pagemodelHooks from "@/hooks/use-pagemodel";
import { contentTableConfig } from "./config/contentConfig";
import pageContet from "@/components/page-content";
import searchBook from "@/service/main/system/searchBook";
import { ref, onUnmounted } from "vue";
import { useStore } from "vuex";
import bookTop from "@/components/book-top";
const formOriginData = {
  name: "",
  type: "",
  press: "",
};
const store = useStore();
const formData = ref(formOriginData);
const pageInfo = ref({
  currentPage: 0,
  pageSize: 10,
});
onUnmounted(() => {
  store.commit("refresh");
});
const restart = () => {
  for (const key in formOriginData) {
    formData.value[`${key}`] = formOriginData[`${key}`];
  }
};
const searchBooks = async () => {
  const result = await searchBook("/books/1/10", formData.value);
  if (
    result.data.flag &&
    result.data.data.records.length != 0 &&
    result.status == 200
  ) {
    //查找成功
    const records = result.data.data.records;
    const count = records.length;
    store.commit("Books/changebooksList", records);
    store.commit("Books/changebooksListTotal", count);
    ElMessage({
      message: "搜索成功",
      type: "success",
    });
  } else {
    ElMessage.error("出错了");
    ElMessage.error(result.data.flag);
  }
};
const newCallback = () => {};
const editCallback = () => {
  const passwordItem = modelConfig.formItems.find(
    (item) => item.field === "id"
  );
  if (passwordItem) {
    passwordItem.isHidden = true;
  }
};
const deletebuttonClick = (item) => {
  ElMessageBox.confirm("你确定要删除吗", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
    type: "warning",
  })
    .then(async () => {
      const result = await deleteBooks(`/books/${item.id}`);
      if (result.data.flag && result.status == 200) {
        store.commit("Books/getbooksPageList", {
          queryInfo: {
            offset: pageInfo.value.currentPage * pageInfo.value.pageSize,
            size: pageInfo.value.pageSize,
          },
        });
        ElMessage({
          type: "success",
          message: "删除成功",
        });
      } else {
        ElMessage.error("删除失败");
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "删除取消",
      });
    });
};
const [pageModalRef, defaultInfo, editbuttonClick, handleNewData] =
  pagemodelHooks(newCallback, editCallback);
</script>

<style lang="scss" scope>
.booksystem {
  padding: 0 20px;
}
</style>
